/**************securePart***************/
.wrapper .main .securePart{
    width: 100%;
    height: 170vw;
    background-color: #292c33;
    color: #dfe3e6;
    padding-top: 9vw;
    padding-left: 5vw;
    box-sizing: border-box;

    user-select: none;
}
.wrapper .main .securePart .securePart-title{
    text-align: center;
    margin-left: -5vw;
    font-size: 3.5vw;
}
.wrapper .main .securePart .user-choose{
    height: 12vw;
    width: 90%;
    background-color: #4795f7;
    margin-top: 2vw;
    margin-left: 2vw;
    margin-bottom: 20vw;
    border-radius: 5px;
    cursor: pointer;

    display: flex;
    align-items: center;
}
.wrapper .main .securePart .user-choose .user-head{
    height: 12vw;
}
.wrapper .main .securePart .user-choose .user-head img{
    height: 12vw;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}
.wrapper .main .securePart .user-choose .user-name{
    width: 80%;
    margin-left: 2vw;
}
.wrapper .main .securePart .user-choose .user-name p:first-child{
    font-size: 3.5vw;
    font-weight: bolder;
}
.wrapper .main .securePart .user-choose .user-name p:last-child{
    font-size: 3vw;
    margin-top: 0.3vw;
    font-weight: lighter;
}
.wrapper .main .securePart .user-choose .more{
    width: 10%;
    font-size: 7vw;
    padding-top: 1vw;
    box-sizing: border-box;
}

/*******弹出菜单*******/
.wrapper .main .securePart .popmenu1{
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /*透明度*/
    display: none;
    z-index: 1000;
}
.wrapper .main .securePart .popmenu1 .popup {
    background-color: #292c33;
    width: 100%;
    height: 45vw;
    position: fixed;
    bottom: 0;
    left: 0;

    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}
.wrapper .main .securePart .popmenu1 .popup .tdesign\:chevron-down-double-s{
    height: 10vw;
    font-size: 6vw;
    color: #606166;
    cursor: pointer;

    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 3vw;
}
.wrapper .main .securePart .popmenu1 .popup_btn button{
    width: 100%;
    height: 17vw;
    cursor: pointer;

    border: none;
    border-top: solid 1px #3d434f;
    outline: none;
    background-color: #292c33;
    color: #dfe3e6;

    display: flex;
    align-items: center;
}
.wrapper .main .securePart .popmenu1 .popup_btn img{
    height: 9vw;
    margin-left: 2vw;
}
.wrapper .main .securePart .popmenu1 .popup_btn .cur-account .info{
    width: 70%;
}
.wrapper .main .securePart .popmenu1 .popup_btn .cur-account .info p:first-child{
    font-size: 4vw;
    font-weight: bolder;
    margin-left: -80%;
}
.wrapper .main .securePart .popmenu1 .popup_btn .cur-account .info p:last-child{
    font-size: 3vw;
    margin-left: -76%;
    margin-top: 1vw;
}
.wrapper .main .securePart .popmenu1 .popup_btn .cur-account .secured{
    width: 20%;
    font-size: 7vw;
    background-image: linear-gradient(to right, #4b9cf7, #17256c);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.wrapper .main .securePart .popmenu1 .popup_btn .add-account div{
    font-size: 7vw;
    margin-left: 3vw;
}
.wrapper .main .securePart .popmenu1 .popup_btn .add-account span{
    font-size: 3.5vw;
    margin-left: 2vw;
}
/******************/

/*********token*********/
.wrapper .main .securePart .token{
    width: 90%;
    height: 48vw;
    margin-left: 2vw;
    margin-top: -8vw;
    box-sizing: border-box;
    padding: 4vw 4vw 3vw;
    background-color: #3c3f48;
    border-radius: 5px;

    text-align: center;
}
.wrapper .main .securePart .token .token-explain{
    font-size: 4vw;
}
.wrapper .main .securePart .token .token-explain p:first-child{
    font-weight: bolder;
}
.wrapper .main .securePart .token .token-explain p:last-child{
    margin-top: 3vw;
}
.wrapper .main .securePart .token .token-show{
    height: 11vw;
    width: 90%;
    margin-left: 5%;
    margin-top: 4vw;
    background-color: #4795f7;
    border-radius: 5px;
    font-size: 4.5vw;
    font-weight: bold;
    cursor: pointer;

    display: flex;
    justify-content: center;
    align-items: center;
}

/*********token-count-down*********/
.wrapper .main .securePart .code-box .token-count-down{
    display: none;
}
.wrapper .main .securePart .code-box .token-count-down:first-child{
    width: 90%;
    height: 90vw;
}
.wrapper .main .securePart .code-box .token-count-down .circle-box{
    position: relative;
    width: 90%;
    height : 90vw;
}
.wrapper .main .securePart .code-box .token-count-down .circle-box .circle{
    width: 45vw;
    height: 90vw;
    position: absolute;
    top: 0;
    overflow: hidden;
}
.wrapper .main .securePart .code-box .token-count-down .circle-box .circle:first-child{
    left: 0;
}
.wrapper .main .securePart .code-box .token-count-down .circle-box .circle:last-child{
    right: -13vw;
}
.wrapper .main .securePart .code-box .token-count-down .circle-box .circle .half-circle {
    width: 70vw;
    height: 70vw;
    border:2vw solid #4795f7;
    border-radius: 50%;
    position: absolute;
    top: 0;
    transform : rotate(-135deg);
}
.wrapper .main .securePart .code-box .token-count-down .circle-box .circle .right{
    border-top:2vw solid #202126;
    border-right:2vw solid #202126;
    right: 8.3vw;
    -webkit-animation: circle_right 20s linear infinite;
}
.wrapper .main .securePart .code-box .token-count-down .circle-box .circle .left{
    border-bottom:2vw solid #202126;
    border-left:2vw solid #202126;
    left: 8.3vw;
    -webkit-animation: circle_left 20s linear infinite;
}

@-webkit-keyframes circle_right{
    0%{
        -webkit-transform: rotate(-135deg);
    }
    50%,100%{
        -webkit-transform: rotate(45deg);
    }
}
@-webkit-keyframes circle_left{
    0%,50%{
        -webkit-transform: rotate(-135deg);
    }
    100%{
        -webkit-transform: rotate(45deg);
    }
}

/*********token-writeCode*********/
.wrapper .main .securePart .code-box{
    position: relative;
}
.wrapper .main .securePart .code-box .token-count-down:last-child{
    position: absolute;
    top: 27vw;
    left: 20vw;
    cursor: pointer;
}
.wrapper .main .securePart .code-box .token-count-down:last-child .token-writeCode p{
    text-align: center;
}
.wrapper .main .securePart .code-box .token-count-down:last-child .token-writeCode p:first-child{
    font-size: 8vw;
    font-weight: bold;
    letter-spacing: 4vw;
    margin-left: 4vw;
}
.wrapper .main .securePart .code-box .token-count-down:last-child .token-writeCode p:last-child{
    color: #5c6167;
    font-size: 5vw;
}

/**************footer***************/
.wrapper .footer .secure{
    color: #4b9cf7;
}